<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>胜平负</title>
    <script src="../static/js/jquery-3.7.1.min.js" type="text/javascript"></script>
    <style>
    table {
        border-collapse: collapse; /*合并边框*/
        width: 100%; /*设置表格宽度*/
    }

    th, td {
        border: 1px solid black; /*设置边框线样式、颜色和大小*/
        padding: 8px; /*设置内边距*/
    }
    .zhong{
            background-color: red;
        }
   .peizhong{
            background-color: magenta;
        }
.xiao_info{
				display: flex;
				                flex-direction: row;
				                flex-wrap: nowrap;
				                justify-content: center;
				                align-items: center;
			}
			.xiao_r1{
				font-size: 30px;
				font-weight: 100;
			}
			.xiao_l{
				padding-left: 5px;
			}
			.xiao_l>div{
				border-bottom: 1px solid black;
			}
        .peid{
            background-color: gray;
        }
        .qiu{
            background-color: darkcyan;
        }
        .yuzhong{
            background-color: chartreuse;
        }
        .span1{
            font-size: 30px;
            font-weight: 100;
            color: red;
        }
        #matchinfo>span{
            padding: 10px;
        }
        .yuche{
            background-color: chartreuse;
        }
        .xuanzhong{
            background-color: royalblue;
            color: white;
            border: 2px solid greenyellow;
        }
        #xuanzheqiu>span{
            border: 1px solid black;
            border-radius: 10px;
            padding: 5px;
        }

</style>

</head>
<body>
<input id="matchId" type="hidden" value="{{ matchId }}">
<input id="tp" type="hidden" value="{{ tp }}">

<div id="matchinfo" style="color: royalblue;font-size: 25px;text-align: center;">

</div>

<div id="xuanzheqiu" style="color: red;font-size: 25px;text-align: center;margin-bottom: 5px;">

</div>
<div style="display: flex;justify-content: center">
    <table id="tjds_spf" >
            <caption>胜平负统计/预测</caption>
            <thead>
                <tr>
                    <td>赔数\结果</td>
                    <td>胜</td>
                    <td>平</td>
                    <td>负</td>
                    <td>赔数统计</td>
                </tr>
            </thead>
            <tbody>
            </tbody>
    </table>
        <table id="tjds_hspf">
            <caption>让球胜平负统计/预测</caption>
            <thead>
                <tr>
                    <td>赔数\结果</td>
                    <td>让胜</td>
                    <td>让平</td>
                    <td>让负</td>
                    <td>赔数统计</td>
                </tr>
            </thead>
            <tbody>
            </tbody>
    </table>

</div>
<div style="text-align: center">
    <select id="single">
        <option value="">全部</option>
        <option value="HAD">普通单关</option>
        <option value="HHAD">让球单关</option>
    </select>
    相似度：<input type="number" id="sim" max="1" min="0.1" value="0.35"/>
    <input type="button" onclick="load()" value="查询"/>
</div>
<table id="t">
    <caption>历史相似数据</caption>
<thead>
<tr>
    <td>日期</td>
    <td>类型</td>
    <td>比赛</td>
    <td>让球</td>
    <td class="qiu">胜</td>
    <td class="qiu">平</td>
    <td class="qiu">负</td>
    <td class='peid'>一赔</td>
    <td class='peid'>二赔</td>
    <td class='peid'>三赔</td>
    <td class="qiu">让胜</td>
    <td class="qiu">让平</td>
    <td class="qiu">让负</td>
    <td class='peid'>一赔</td>
    <td class='peid'>二赔</td>
    <td class='peid'>三赔</td>
    <td>赔数</td>
    <td>结果</td>
    <td>让球赔数</td>
    <td>让球结果</td>
    <td>最终比分</td>
    <td>操作</td>
</tr>
</thead>
    <tbody>
    </tbody>
</table>
</body>

<script type="text/javascript">
    $(function () {
       load();
    });
        // 加载数据
        function load() {
            var sim = $('#sim').val();
            if(sim < 1&&sim > 0){
                //加载前清空之前页面的显示
                $("#tjds_spf>tbody").html("");
                $("#tjds_hspf>tbody").html("");
                $("#t>tbody").html("");
                $("#matchinfo").html("");
                var tp = $('#tp').val();
                var single = $('#single').val();
                // 获取后台数据
                $.get('/hda_ds',{"tp":tp,"matchId":$('#matchId').val(),"sim":sim,"single":single}, function(r) {
                    var tjds_spf = r.tjds.spf;//胜平负统计信息
                    var tjds_spf_arr = showtjds(tjds_spf,"spf");
                    $("#tjds_spf").append(tjds_spf_arr.join(" "));

                    var tjds_hspf = r.tjds.hspf;//让球胜平负统计信息
                    var tjds_hspf_arr = showtjds(tjds_hspf,"hspf");
                    $("#tjds_hspf").append(tjds_hspf_arr.join(" "));

                    var arr = new Array();
                    var res = r.someds;//历史数据
                    var typedata = res.typedata;
                    if(typedata){
                        var qius = typedata.spfv;
                        var peis = typedata.peid_spf;
                        var pei = typedata.matchResult.spf[1];
                        var qiu = typedata.matchResult.spf[3];

                        // 显示将要预测的比赛信息
                        shouyuinfo(typedata);

                        arr.push("<tr");arr.push(" title=");arr.push(typedata.data);arr.push(" />");
                        arr.push("<td>");arr.push(typedata.matchDate+"&nbsp;&nbsp;"+typedata.matchNumStr);arr.push("</td>");
                        arr.push("<td>");arr.push(typedata.leagueAbbName);arr.push("</td>");
                        arr.push("<td>");arr.push(typedata.homeTeamAbbName+"vs"+typedata.awayTeamAbbName);arr.push("</td>");
                        arr.push("<td>");arr.push(typedata.goalLine);arr.push("</td>");
                        for (var j = 0; j < qius.length; j++) {
                            //按球来显示
                            if (qiu == j) {
                                arr.push("<td class='yuzhong'>");
                            } else {
                                arr.push("<td>");
                            }
                            arr.push(qius[j]);
                            arr.push("</td>");
                        }
                        for (var j = 0; j < peis.length; j++) {
                            //按赔来显示
                            if (pei == (j + 1)) {
                                arr.push("<td class='yuzhong'>");
                            } else {
                                arr.push("<td>");
                            }
                            arr.push(hadTospf(peis[j][0],"spf"));
                            arr.push("</td>");
                        }
                        if(qius.length==0){
                             for (var j = 0; j < 6; j++) {
                                 arr.push("<td></td>");
                             }
                        }
                        // 让球
                        var hqius = typedata.hspfv;
                        var hpeis = typedata.peid_hspf;
                        var hpei = typedata.matchResult.hspf[1];
                        var hqiu = typedata.matchResult.hspf[3];

                        for (var j = 0; j < hqius.length; j++) {
                            //按球来显示
                            if (hqiu == j) {
                                arr.push("<td class='yuzhong'>");
                            } else {
                                arr.push("<td>");
                            }
                            arr.push(hqius[j]);
                            arr.push("</td>");
                        }
                        for (var j = 0; j < hpeis.length; j++) {
                            //按赔来显示
                            if (hpei == (j + 1)) {
                                arr.push("<td class='yuzhong'>");
                            } else {
                                arr.push("<td>");
                            }
                            arr.push(hadTospf(hpeis[j][0],"hspf"));
                            arr.push("</td>");
                        }

                        if(tp == "selling"){
                                arr.push("<td>");arr.push("待开奖");arr.push("</td>");
                                arr.push("<td>");arr.push("待开奖");arr.push("</td>");
                                arr.push("<td>");arr.push("待开奖");arr.push("</td>");
                                arr.push("<td>");arr.push("待开奖");arr.push("</td>");
                                arr.push("<td>");arr.push("待开奖");arr.push("</td>");
                                arr.push("<td></td>");
                            }else {
                                arr.push("<td>");arr.push(hadTospf(pei,"spf"));arr.push("</td>");
                                arr.push("<td>");arr.push(qiu);arr.push("</td>");
                                arr.push("<td>");arr.push(hadTospf(hpei,"hspf"));arr.push("</td>");
                                arr.push("<td>");arr.push(hqiu);arr.push("</td>");
                                arr.push("<td>");arr.push(typedata.matchResult.sectionsNo999);arr.push("</td>");
                                arr.push("<td></td>");
                            }

                        arr.push("</tr>");
                    }
                    var somelist = res.somelist;
                    for(var i=0;i<somelist.length;i++) {
                        var qius = somelist[i].spfv;
                        var peis = somelist[i].peid_spf;
                        var pei = somelist[i].matchResult.spf[1];
                        var qiu = somelist[i].matchResult.spf[3];
                        var hda_r = somelist[i].matchResult.spf[0];

                        //单关显示
                        var singleList = somelist[i].singleList;
                        var showsing = "";
                        if (singleList.includes("HAD")){//说明有胜平负单关
                            showsing = "单关";
                        }
                        if (singleList.includes("HHAD")){//说明有让球胜平负单关
                            showsing = "让球单关";
                        }
                        arr.push("<tr");arr.push(" title=");arr.push(somelist[i].data);arr.push(" />");
                        arr.push("<td>");arr.push(somelist[i].matchDate+"&nbsp;&nbsp;"+somelist[i].matchNumStr);arr.push("&nbsp;&nbsp;"+showsing);arr.push("</td>");
                        arr.push("<td>");arr.push(somelist[i].leagueAbbName);arr.push("</td>");
                        arr.push("<td>");arr.push(somelist[i].homeTeamAbbName+"vs"+somelist[i].awayTeamAbbName);arr.push("</td>");
                        arr.push("<td>");arr.push(somelist[i].goalLine);arr.push("</td>");
                        for (var j = 0; j < qius.length; j++) {
                            //按球来显示
                            if (qiu == j) {
                                arr.push("<td class='zhong'>");
                            } else {
                                arr.push("<td>");
                            }
                            arr.push(qius[j]);
                            arr.push("</td>");
                        }
                        for (var j = 0; j < peis.length; j++) {
                            //按赔来显示
                            if (pei == (j + 1)) {
                                arr.push("<td class='zhong'>");
                            } else {
                                arr.push("<td>");
                            }
                            arr.push(hadTospf(peis[j][0],"spf"));
                            arr.push("</td>");
                        }
                        if(qius.length==0){
                             for (var j = 0; j < 6; j++) {
                                 arr.push("<td></td>");
                             }
                        }

                        //让球
                        var hqius = somelist[i].hspfv;
                        var hpeis = somelist[i].peid_hspf;
                        var hpei = somelist[i].matchResult.hspf[1];
                        var hqiu = somelist[i].matchResult.hspf[3];
                        var hhda_r = somelist[i].matchResult.hspf[0];
                        for (var j = 0; j < hqius.length; j++) {
                            //按球来显示
                            if (hqiu == j) {
                                arr.push("<td class='peizhong'>");
                            } else {
                                arr.push("<td>");
                            }
                            arr.push(hqius[j]);
                            arr.push("</td>");
                        }
                        for (var j = 0; j < hpeis.length; j++) {
                            //按赔来显示
                            if (hpei == (j + 1)) {
                                arr.push("<td class='peizhong'>");
                            } else {
                                arr.push("<td>");
                            }
                            arr.push(hadTospf(hpeis[j][0],"hspf"));
                            arr.push("</td>");
                        }
                        arr.push("<td>");arr.push(pei);arr.push("</td>");
                        arr.push("<td>");arr.push(hadTospf(hda_r,"spf"));arr.push("</td>");
                        arr.push("<td>");arr.push(hpei);arr.push("</td>");
                        arr.push("<td>");arr.push(hadTospf(hhda_r,"hspf"));arr.push("</td>");
                        arr.push("<td>");arr.push(somelist[i].matchResult.sectionsNo999);arr.push("</td>");
                        var detail = "";
                        if(tp=="None"){
                             detail = "<a href='/hda?tp=history&matchId="+somelist[i].matchId+"' target=\"_blank\">"+somelist[i].matchNumStr+"  同赔</a>";
                        }

                        arr.push("<td>");arr.push(detail);arr.push("</td>");
                        arr.push("</tr>");
                }
                $("#t").append(arr.join(" "));
                });
            }else {
                alert("请填写正确的相似度值（0到1之间）！！！")
            }
        }

    function selectA(e) {
        var id = $(e).attr("id");
        var d = $(e).attr("d");

        if(d == 0){
            $("#"+id).attr("d",1);
            $("#"+id).addClass("xuanzhong");

        }else {
             $("#"+id).attr("d",0);
             $("#"+id).removeClass("xuanzhong");
        }
         $("#xuanzheqiu").html("");
        //获取所有选择的
            var qius = $('.xuanzhong');
            var arr = [];
            arr.push("预测：");
            for(var i=0;i<qius.length;i++){
                var tp = $(qius[i]).attr("tp");
                var v = $(qius[i]).attr("v");
                var q ="<span class=''>"+abcTospf(v,tp)+"</span>";
                arr.push(q);
            }
            $("#xuanzheqiu").append(arr.join(" "));

    }

    // 显示统计信息里面的表格信息
    function showinfo(d,j,tp) {
           var arr = new Array();
           if(d[d.length-1]==1){
               var id = j+tp;
               arr.push("<div class=\"xiao_info yuche\" id="+id+" tp="+tp+" v="+j+" d='0' onclick=\"selectA(this)\">");
           }else{
              arr.push("<div class=\"xiao_info\">");
           }

           arr.push("<div>");
           var s1 = "<div class=\"xiao_r1\" title=\"命中数量\">"+d[0]+"</div>";
           arr.push(s1);
           var s2 = "<div class=\"xiao_r2\" title=\"命中率\">"+d[1]+"</div>";
           arr.push(s2);
           arr.push("</div>");
           arr.push("<div class=\"xiao_l\">");
           var s3 = "<div title=\"当前遗漏\">"+d[5]+"</div>";
           arr.push(s3);
           var s4 = "<div title=\"平均遗漏\">"+d[3]+"</div>";
           arr.push(s4);
           arr.push("</div>");
           arr.push("<div class=\"xiao_l\">");
           var s5 = "<div title=\"最大间隔\">"+d[2]+"</div>";
           arr.push(s5);
           var s6 = "<div title=\"方差\">"+d[4]+"</div>";
           arr.push(s6);
           arr.push("</div>");
           arr.push("<div class=\"xiao_l\">");
           var s5 = "<div title=\"出现可能性\">"+d[7]+"</div>";
           arr.push(s5);
           var s6 = "<div title=\历史命中率\">"+d[6]+"</div>";
           arr.push(s6);
           arr.push("</div>");
           arr.push("</div>");
           return arr;

       }

       // 显示将要预测的比赛信息
       function shouyuinfo(d) {
           var arr = new Array();
           arr.push("<span>"+d.matchDate+"</span><span>"+d.matchTime+"</span><span>"+d.matchNumStr+"</span><span>"+d.homeTeamAbbName+"("+d.goalLine+")vs"+d.awayTeamAbbName +"</span>");
           $("#matchinfo").append(arr.join(" "));
       }

        // 统计胜平负信息
       function showtjds(tjds_spf,tp) {
            var tjds_spf_arr = new Array();
                   for(var i=0;i<tjds_spf.length;i++) {
                        tjds_spf_arr.push("<tr>");
                        tjds_spf_arr.push("<td>");
                        if(i < tjds_spf.length-1){
                            tjds_spf_arr.push((i+1) + "赔");
                        }else{
                             tjds_spf_arr.push("统计");
                        }
                        tjds_spf_arr.push("</td>");
                        var tc = 0;
                        for(var j=0;j<tjds_spf[i].length;j++) {
                            tjds_spf_arr.push("<td>");
                            if(tjds_spf[i][j][0]>0){
                                    tjds_spf_arr.push(...showinfo(tjds_spf[i][j],j,tp));
                                    tc += tjds_spf[i][j][0];
                            }
                            if(j==3&i==3){
                                tjds_spf_arr.push("共<span class='span1'>"+tc+"</span>条数据");
                            }
                            tjds_spf_arr.push("</td>");
                        }
                        tjds_spf_arr.push("</tr>");
                    }
                   return tjds_spf_arr;
       }

       //h：胜，d:平，a：负
    function hadTospf(a,tp) {
        var r = "-";
        if(tp == 'hspf'){
            if(a=='h'){
                r = '让胜';
            }
            else if(a=='d'){
                r = '让平';
            }
            else if(a=='a'){
                r = '让负';
            }
        }else {
            if(a=='h'){
                r = '胜';
            }
            else if(a=='d'){
                r = '平';
            }
            else if(a=='a'){
                r = '负';
            }
        }
        return r;

    }

          //a:   0：胜，1:平，2：负
    function abcTospf(a,tp) {
        var r = "-";
        if(tp == 'hspf'){
            if(a==0){
                r = '让胜';
            }
            else if(a==1){
                r = '让平';
            }
            else if(a==2){
                r = '让负';
            }
        }else {
            if(a==0){
                r = '胜';
            }
            else if(a==1){
                r = '平';
            }
            else if(a==2){
                r = '负';
            }
        }
        return r;

    }
</script>
</html>